Directly from Coursera DeepLearning.ai course.
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@latest"> </script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/mobilenet@1.0.0"> </script>
</head>
<body>
<!-- Feel free to replace the quotes in src with these
"/image/coffee.jpg"
"/image/cat.jpg"
"/image/pig.jpg"
-->
<img id="img" src="/image/pig.jpg" style="height:700px"></img>
<div id="output" style="font-family:courier;font-size:24px;height:300px"></div>
</body>
<script>
const img = document.getElementById('img');
const outp = document.getElementById('output');
mobilenet.load().then(model => {
model.classify(img).then(predictions => {
console.log(predictions);
for(var i = 0; i<predictions.length; i++){
outp.innerHTML += "<br/>" + predictions[i].className + " : " + predictions[i].probability;
}
});
});
</script>
</html>
Output
hog, pig, grunter, squealer, Sus scrofa : 0.34310200810432434
hippopotamus, hippo, river horse, Hippopotamus amphibius : 0.236879363656044
warthog : 0.15335048735141754